<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <!-- 头部 -->
    <header class="dpflex">
        <i class="iconfont icon-left" id="goBack"></i>
        <p>个人资料</p>
    </header>

    <!-- 主体 -->
    <main>
        <!-- 头像 -->
        <p aria-labelledby="js_cell_tl2_tips js_cell_tl2_link" class="weui-cell  weui-cell_access" href="javascript:">
            <span class="weui-cell__bd" aria-hidden="true" id="js_cell_tl2_tips">
                <b>更换头像</b>
            </span>
            <span class="weui-cell__ft" aria-hidden="true" id="js_cell_tl2_link">
                <img id="portrait" src="../imgs/头像.jpg" alt="" style="width: 80px; height: 80px; border-radius: 50%;">
                <input type="file" name="" id="inputfile" style="display: none;">
            </span>
        </p>

        <!-- 昵称 -->
        <label for="js_input1" class="weui-cell weui-cell_active" id="js_cell">
            <div class="weui-cell__hd"><b class="weui-label">昵称</b></div>
            <div class="weui-cell__bd weui-flex">
                <input id="nickname" class="weui-input dpflex" type="text" pattern="[0-9]*" placeholder="用户名"
                    maxlength="16" />
                <button id="js_input_clear" class="weui-btn_reset weui-btn_icon weui-btn_input-clear">
                </button>
            </div>
        </label>

        <!-- 性别 -->
        <a aria-labelledby="js_cell_tl2_tips js_cell_tl2_link" class="weui-cell  weui-cell_access" href="javascript:" id="sexPicker">
            <span class="weui-cell__bd" aria-hidden="true" id="js_cell_tl2_tips">
                <b>性别</b>
            </span>
            <span class="weui-cell__ft" aria-hidden="true" id="sex">请选择</span>
        </a>

        <!-- 生日 -->
        <a aria-labelledby="js_cell_tl2_tips js_cell_tl2_link" class="weui-cell  weui-cell_access" href="javascript:" id="birthdayPicker">
            <span class="weui-cell__bd" aria-hidden="true" id="js_cell_tl2_tips">
                <b>生日</b>
            </span>
            <span class="weui-cell__ft" aria-hidden="true" id="birthday">请选择</span>
        </a>

        <!-- 所在省份 -->
        <a aria-labelledby="js_cell_tl2_tips js_cell_tl2_link" class="weui-cell  weui-cell_access" href="javascript:" id="provincePicker">
            <span class="weui-cell__bd" aria-hidden="true" id="js_cell_tl2_tips">
                <b>省份</b>
            </span>
            <span class="weui-cell__ft" aria-hidden="true" id="province">请选择</span>
        </a>
        
        <!-- 城市 -->
        <a aria-labelledby="js_cell_tl2_tips js_cell_tl2_link" class="weui-cell  weui-cell_access" href="javascript:" id="cityPicker">
            <span class="weui-cell__bd" aria-hidden="true" id="js_cell_tl2_tips">
                <b>城市</b>
            </span>
            <span class="weui-cell__ft" aria-hidden="true" id="city">请选择</span>
        </a>


        <!-- 个人简介 -->
        <p aria-labelledby="js_cell_tl2_tips js_cell_tl2_link" class="weui-cell  weui-cell_access" href="javascript:">
            <span class="weui-cell__bd" aria-hidden="true" id="js_cell_tl2_tips">
                <b>个人简介</b>
            </span>
        </p>
        <div class="proson-intro">
            <div class="weui-cells weui-cells_form" style="background-color: #ccc; border-radius: 25px;">
                <div class="weui-cell weui-cell_active">
                    <div class="weui-cell__bd">
                        <textarea id="sign" class="weui-textarea" placeholder="修改您的个性签名" rows="3" maxlength="30"></textarea>
                        <div role="option" aria-live="polite" class="weui-textarea-counter"><span id="textNum">0</span>/30</div>
                    </div>
                </div>
            </div>
        </div>

        <!-- 保存信息 -->
        <div class="btn">
            <button class="save-btn" id="savaBtn">保存信息</button>
        </div>
    </main>
</body>

</html>